import React,{Component} from 'react'
import {Modal} from 'antd'
import {withRouter} from 'react-router-dom'
import './index.less'
import StrorageUtils from 'utils/storageUtils'
import pageMenu from 'config/pageMenu'
import LinkButton from 'common/link-button'
/**
 * 名称：header组件
 * 描述：header组件
 * 调用：管理页面
 * 输入： 
 * 时间：20220328
 */
class Header extends Component{
    /**
     * 函数：logout
     * 功能：退出登陆
     */
    logout = () =>{
        Modal.confirm({
            title:"确认退出",
            onOk : ()=>{
                console.log("ok")
                StrorageUtils.removeUser()
                this.props.history.replace('/login')
            },
            onCancel : ()=>{
                console.log("cancel")
            }
        })
    }
    /**
     * 函数：getTitle
     * 功能：通过路径获取标题
     */
    getTitle = ()=>{
        let title = ''
        const path = this.props.location.pathname
        console.log(path)
        pageMenu.map(item => {
            
            if (item.to === path){
                title = item.title
            } else if(item.children){
                let cItem = item.children.find(cItem => {
                    return cItem.to === path
                })
                if(!cItem){
                    cItem = item.children.find(cItem => {
                       let reg = new RegExp(cItem.to);
                        //如果字符串中不包含目标字符会返回-1
                       return path.match(reg)
                    })
                }
                if(cItem){
                    title = cItem.title
                }
            }

        });
        return title
    }
    render(){
        const user = StrorageUtils.getUser()
        const title = this.getTitle()
        return (
            <div className ="header">
                <div className ="header-top">
                欢迎，{user.username}
                <LinkButton onClick={this.logout}>退出</LinkButton>
                </div>
                <div className ="header-bottom">
                    <div className ="header-bottom-left">{title}</div>
                    
                </div>
            </div>
        )
    }

}
export default withRouter(Header)